<!--
Google IO 2012 HTML5 Slide Template

Authors: Eric Bidelman <ebidel@gmail.com>
Luke Mahe <lukem@google.com>

URL: https://code.google.com/p/io-2012-slides
-->
<!DOCTYPE html>
<html>
    <head>
        <title></title>
        <meta charset="utf-8">
        <meta http-equiv="X-UA-Compatible" content="chrome=1">
        <!--<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0">-->
        <!--<meta name="viewport" content="width=device-width, initial-scale=1.0">-->
        <!--This one seems to work all the time, but really small on ipad-->
        <!--<meta name="viewport" content="initial-scale=0.4">-->
        <meta name="apple-mobile-web-app-capable" content="yes">
        <link rel="stylesheet" media="all" href="theme/css/default.css">
        <link rel="stylesheet" media="all" href="theme/css/app.css">
        <link rel="stylesheet" media="only screen and (max-device-width: 480px)"
        href="theme/css/phone.css">
        <base target="_blank">
        <!-- This amazingness opens all links in a new tab. -->
        <script data-main="js/slides" src="js/require.js"></script>
    </head>
    <body style="opacity: 0">

        <slides class="layout-widescreen">
            <!-- <slide class="logoslide nobackground">
            <article class="flexbox vcenter">
            <span><img src="images/google_developers_logo.png"></span>
            </article>
            </slide>
            -->
            <slide class="title-slide segue nobackground">
                <aside class="gdbar">
                    <img src="images/google_developers_icon_128.png">
                </aside>
                <!-- The content of this hgroup is replaced programmatically through the slide_config.json. -->
                <hgroup class="auto-fadein">
                    <h1 data-config-title><!-- populated from slide_config.json --></h1>
                    <h2 data-config-subtitle><!-- populated from slide_config.json --></h2>
                    <p data-config-presenter>
                        <!-- populated from slide_config.json -->
                    </p>
                </hgroup>
            </slide>
            {% for slide in slides %}
            <slide {% if
            slide.class %}class="{{- slide.class -}}" {% endif %} {% if
            slide.image %}style="background-image: url({{- slide.image -}})"{% endif %}>
                {% if 'segue' in slide.class %}
                <aside class="gdbar">
                    <img src="images/google_developers_icon_128.png">
                </aside>
                <hgroup class="auto-fadein">
                    <h2>{{- slide.title -}}</h2>
                    <h3>{{- slide.subtitle -}}</h3>
                </hgroup>
                {% else %}
                <hgroup>
                    <h2>{{- slide.title -}}</h2>
                    <h3>{{- slide.subtitle -}}</h3>
                </hgroup>
                <article {% if slide.content_class %}class="{{- slide.content_class -}}"{% endif %}>
                    {{- slide.content -}}
                </article>
                {% endif %}
            </slide>
            {% endfor %}
            <slide class="thank-you-slide segue nobackground">
                <aside class="gdbar right">
                    <img src="images/google_developers_icon_128.png">
                </aside>
                <article class="flexbox vleft auto-fadein">
                    <h2>&lt;Thank You!&gt;</h2>
                    <p>
                        Important contact information goes here.
                    </p>
                </article>
                <p class="auto-fadein" data-config-contact>
                    <!-- populated from slide_config.json -->
                </p>
            </slide>
            <!-- <slide class="logoslide dark nobackground">
            <article class="flexbox vcenter">
            <span><img src="images/google_developers_logo_white.png"></span>
            </article>
            </slide> -->
            <slide class="backdrop"></slide>
        </slides>

        <!--[if IE]>
        <script src="http://ajax.googleapis.com/ajax/libs/chrome-frame/1/CFInstall.min.js"></script>
        <script>CFInstall.check({mode: 'overlay'});</script>
        <![endif]-->
    </body>
</html>
